<template>
	<view class="uni-container">
		  <div class="block">
			<el-date-picker
			  v-model="dateList"
			  type="monthrange"
			  range-separator="至"
			  start-placeholder="开始月份"
			  end-placeholder="结束月份"
			  size="mini"
			  >
			</el-date-picker>
			<el-button type="primary" size="mini" @click="changeCurTime">查询</el-button>
		  </div>
		<view class="charts-box">
		  <br>
		  <p align="center" style="color:#7cb5ec">本月收益 : {{dayValue}}元</p>
		  <p align="center" style="color:#7cb5ec">总计收益 : {{allValue}}元</p>
		  <qiun-data-charts
			type="pie"
			:chartData="chartData"
			background="none"
		  />
		  <p align="center" style="color:#7cb5ec">本月流水 : {{beforeDay}}元</p>
          <p align="center" style="color:#7cb5ec">总计流水 : {{beforeAll}}元</p>
		  <p align="center" style="color:#7cb5ec">趋势图</p>
		  <qiun-data-charts
			type="line"
			:chartData="lineData"
			background="none"
			@getIndex="getIndex"
		  />
		</view>
	</view>
</template>

<script>
    export default {
        data() {
            return {
                dateList : [],
                beforeAll:0,
                beforeDay:0,
                allValue : 0,
				dayValue : 0,
				chartData:{},
				lineData:{}
            }
        },
        methods: {
			onLoad() {
                var date1 = new Date()
				date1.setDate(1)
				date1.setHours(0,0,0,0)
				var date2 = new Date()
				date2.setDate(1)
				date2.setHours(0,0,0,0)
				date2.setMonth(0)
                this.dateList[1] = date1
                this.dateList[0] = date2
				this.getHistoryInfo()
			},
            changeCurTime(){
				console.log(this.dateList)
                this.getHistoryInfo()
            },
			getIndex(e){
				var index = e.currentIndex.index
				this.getDayInfo(index)
			},
			getDayInfo(index){
				var info = []
				this.dayValue = 0
				this.beforeDay = 0
				for(var i in this.lineData["series"]){
					if(this.lineData["series"][i]["name"] != "总收益"){
						var value = this.lineData["series"][i]["data"][index]
						if(value){
							info.push({name : this.lineData["series"][i]["name"],value : value})
							this.beforeDay += this.lineData["series"][i]["before"][index]
							this.dayValue += value
						}
					}
				}
				this.chartData["series"][0]["data"] = info
			},
			getHistoryInfo(){
				var num = 0
				num = this.dateList[1].getMonth()-this.dateList[0].getMonth()
				num += (this.dateList[1].getYear() - this.dateList[0].getYear())*12
				this.request("/history_month",{time : this.dateList[1].getTime(),num:num},(res) => {
					this.chartData = {
						"series": [
							{
								"data": []
							}
						]
					}
					this.lineData = {
						"categories": [],
						"series": []
					}
					if(res.data){
						this.allValue = 0
						this.beforeAll = 0
						this.lineData = {"categories":[],"series":[]}
						for(var i = 0;i < res.data.length;i++){
							for(var j = 0;j < res.data[i]["list"].length;j++){
								if(res.data[i]["list"][j])
									res.data[i]["list"][j] = JSON.parse(res.data[i]["list"][j])
								if(!res.data[i]["list"][j]["a_pay_amount"])
									res.data[i]["list"][j]["a_pay_amount"] = 0
								res.data[i]["list"][j]["before"] = Number(res.data[i]["list"][j]["a_pay_amount"])
								res.data[i]["list"][j]["a_pay_amount"] = Math.round(res.data[i]["list"][j]["a_pay_amount"] * Number(res.data[i]["rate"]))
							}
							res.data[i]["list"].reverse()
						}
						var allInfo = {
							name : "总收益",
							data : []
						}
						for(var i = 0;i < res.data[0]["list"].length;i++){
							var d = new Date(res.data[0]["list"][i]["date"])
							var str = (d.getMonth() + 1) +"月"
							allInfo.data[i] = 0
							this.lineData["categories"].push(str)
						}
						for(var i = 0;i < res.data.length;i++){
							var info = {}
							info.name = res.data[i]["des"]
							info.data = []
							info.before = []
							var num = 0
							if(res.data[i]["list"]){
								for(var j = 0;j < res.data[i]["list"].length;j++){
									if(res.data[i] && res.data[i]["list"][j] && res.data[i]["list"][j]["a_pay_amount"]){
										info.data[j] = res.data[i]["list"][j]["a_pay_amount"]
										allInfo.data[j] += res.data[i]["list"][j]["a_pay_amount"]
										this.allValue += res.data[i]["list"][j]["a_pay_amount"]
										num += allInfo.data[j]
									}else
										info.data[j] = 0
			                        this.beforeAll += res.data[i]["list"][j]["before"]
			                        info.before[j] = res.data[i]["list"][j]["before"]
								}
							}
							if(num){
								this.lineData["series"].push(info)
							}
						}
						this.lineData["series"].push(allInfo)
						this.getDayInfo(this.lineData["series"][0]["data"].length-1)
					}
				})
			},
            // request请求
            request(path,options,success) {
				this.$axios.post(path,options)//传参
				.then(function(res){
					  success(res)
				})
				.catch(function(err){
					  console.log("请求失败233");
				});
            }
		}
    }
</script>

<style>
	/* #ifndef H5 */
	.charts-box{
	  width: 100%;
	  height:300px;
	}
	/* #endif */
</style>
